window.onload = function() {
    //添加购物车
    document.getElementsByClassName('setShoppingCart')[0].onclick = function() {
        var productInfo = sessionStorage['products'];
        var title = JSON.parse(productInfo);
        console.log(title[0].title);
        var shoppingCart = localStorage['titles'];
        if (shoppingCart == null) {
            var titles = [];
            titles.push({
                "title": title[0].title
            })
            localStorage['titles'] = JSON.stringify(titles)
        } else {
            var titles = JSON.parse(localStorage['titles'])
            titles.push({
                "title": title[0].title
            })
            localStorage['titles'] = JSON.stringify(titles)
        }
    }
}
var Random = Mock.Random;

$(function() {
    //放大镜
    $("#left").mouseover(function() {
        $('#mask').css("display", "block");
        $("#right").css("display", "block");
    })
    $("#left").mouseout(function() {
        $('#mask').css("display", "none");
        $("#right").css("display", "none");
    })
    $("#left").mousemove(function(e) {
            $x = e.clientX - parseInt($("#left").offset().left) - parseInt($("#mask").width()) / 2;
            $y = e.clientY - parseInt($("#left").offset().top) - parseInt($("#mask").height()) / 2;
            if ($x < 0) {
                $x = 0;
            }
            if ($x > parseInt($("#left").width()) - parseInt($("#mask").width())) {
                $x = parseInt($("#left").width()) - parseInt($("#mask").width());
            }
            if ($y < 0) {
                $y = 0;
            }
            if ($y > parseInt($("#left").height()) - parseInt($("#mask").height())) {
                $y = parseInt($("#left").height()) - parseInt($("#mask").height());
            }
            $("#mask").css("left", $x + 'px').css("top", $y + 'px');
            var $imgleft = parseInt($("#right").width()) / parseInt($("#mask").width())
            $("#thisPic2").css("marginLeft", (-$x) * $imgleft + 'px').css("marginTop", (-$y) * $imgleft + 'px')
        })
        //获取json中所有商品
    $.get('data/goods.json', function(response) {
            var data = response;
            for (let i = 0; i < data.goods.length; i++) {
                if (data.goods[i].title == title[0].title) {
                    var message = data.goods[i].message;
                    var price = data.goods[i].price;
                    var shop = data.goods[i].shop;
                    var imgSrc = data.goods[i].imgPath;
                    $('.goodMessage').html(message);
                    $('.price').html(price);
                    $('.shop').html(shop);
                    var strPic1 = `<div id="mask"></div>
                <img src="${imgSrc}" alt="" class="thisPic1">`;
                    var strPic2 = `<img src="${imgSrc}" alt="" id="thisPic2">`;
                    $('#left').html(strPic1);
                    $('#right').html(strPic2);
                };
            }
        })
        //获取用户名
    var userinfo = sessionStorage['users']
    if (userinfo == null) {
        $('#userName').html("未登录");
        $('#login').html('登录/注册')
    } else {
        var user = JSON.parse(sessionStorage['users'])
        $('#userName').html(user[0].Name)
        $('#login').html('退出登录')
    }
    //获取商品标题
    var productInfo = sessionStorage['products'];
    if (productInfo == null) {
        location.href = 'index.html';
    } else {
        var goodName = productInfo;
        var title = JSON.parse(goodName);
        $('.title').html(title[0].title);
    }
    Mock.mock('http://localhost:5500/api/getEvaluation', function() {
        var result = [];
        for (var i = 0; i < 4; i++) {
            var rndEva = Mock.mock({
                'userName': Random.cname(3),
                'userMessage': Random.cparagraph(),
                'time': Random.datetime('y-M-d HH:mm:ss')
            })
            result.push(rndEva);
        }
        console.log(rndEva);
        return result;
    })
    $.ajax({
        url: 'http://localhost:5500/api/getEvaluation',
        type: 'get',
        dataType: 'json',
        success: function(data) {
            var strHTML = '';
            for (var i = 0; i < data.length; i++) {
                strHTML += `
                        <li>
                            <div class="message">
                            <div>${data[i].userMessage}</div>
                            <div>${data[i].time}</div>
                            </div>
                            <div class="userName">${data[i].userName}</div>
                        </li>`
            }
            $('.evaluation').html(strHTML);
        },
        error: function(e) {
            console.log('错误信息' + e);
        }
    })

    $(".toSettlement").on('click', function() {
        var productInfo = sessionStorage['products'];
        var title = JSON.parse(productInfo);
        var buyGood = [];
        buyGood.push({ "goods": title[0] });
        sessionStorage['buyGood'] = JSON.stringify(buyGood);
        var userInfo = sessionStorage['users'];
        if (userInfo == null) {
            $(".modal").modal({
                backdrop: "static"
            })
        } else {
            location.href = 'settlement.html'
        }
    })

    $(".goLogin").on('click', function() {
        location.href = 'login.html'
    })


})

function out() {
    sessionStorage.clear()
    if ($('#login').html() == '退出登录') {
        location.href = 'index.html'
    } else {
        location.href = 'login.html'
    }
}